<template>
	<view>
		<uni-nav-bar :title="title" :statusBar="true" :border="false" left-icon="back" :fixed="true"
			@clickLeft="$tab.back()">
		</uni-nav-bar>
		<u-line color="#F8F8F8"></u-line>

		<view class="text-48 font-700 text-center" style="margin-top: 136rpx;">
			{{ftitle}}
		</view>

		<view class="text-center" style="margin-top: 90rpx;">
			<view class="text-9E9E9E">
				{{fftitle}}
			</view>
			<input type="text" v-model="notes" class="notes text-center text-32" v-if="type != 3" />
			
			<textarea auto-height v-model="notes" class="textarea py-24 px-24" :maxlength="300" v-else></textarea>
		</view>

		<view class="add round-16 text-center text-FFF text-32 bg-theme" @click="confirm">
			完成
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				notes: "", //输入内容
				id: null,
				type: null, // 1 修改备注
				title: "",
				ftitle: "",
				fftitle: "",
			};
		},
		onLoad(e) {
			this.type = e.type
			if (this.type == 1) {
				this.id = e.userId
				this.notes = e.notes
				this.title = "备注"
				this.ftitle = "设置好友备注"
				this.fftitle = "备注昵称"
			}
			if (this.type == 2) {
				this.id = e.id
				this.notes = ""
				this.title = "修改群名称"
				this.ftitle = "设置群名称"
				this.fftitle = "群名称"
				this.getDetail()
			}
			if (this.type == 3) {
				this.id = e.id
				this.notes = ""
				this.title = "修改群公告"
				this.ftitle = "设置群公告"
				this.fftitle = "群公告"
				this.getDetail()
			}

			if (this.type == 4) {
				this.id = e.id
				this.notes = ""
				this.title = "修改群昵称"
				this.ftitle = "设置群昵称"
				this.fftitle = "群昵称"
				this.getDetail()
			}
		},
		methods: {
			async getDetail() {
				const res = await this.$Api.chat.groupDetail(this.id)
				if (this.type == 2) {
					this.notes = res.data.groupInfo.groupName
				}
				if (this.type == 3) {
					this.notes = res.data.groupInfo.groupNotice
				}

				if (this.type == 4) {
					this.notes = res.data.nickName
				}
			},
			async confirm() {
				if (this.type == 1) {
					const res = await this.$Api.chat.updateFriendName({
						userId: this.id,
						groupName: this.notes
					})
					this.$modal.msg('修改成功!')
					this.$tab.back(1500)
				}

				if (this.type == 2) {
					const res = await this.$Api.chat.updateGroupInfo({
						groupId: this.id,
						groupName: this.notes
					})
					this.$modal.msg('修改成功!')
					this.$tab.back(1500)
				}

				if (this.type == 3) {
					const res = await this.$Api.chat.updateGroupInfo({
						groupId: this.id,
						groupNotice: this.notes
					})
					this.$modal.msg('修改成功!')
					this.$tab.back(1500)
				}

				if (this.type == 4) {
					const res = await this.$Api.chat.updateGroupNickName({
						groupId: this.id,
						nickName: this.notes
					})
					this.$modal.msg('修改成功!')
					this.$tab.back(1500)
				}
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}

	.notes {
		width: 686rpx;
		height: 88rpx;
		background: #F8F8F8;
		line-height: 88rpx;
		margin: 24rpx auto 0;
	}
	
	.textarea{
		width: 686rpx;
		background: #F8F8F8;
		margin: 24rpx auto 0;
		text-align: left;
	}

	.add {
		width: 480rpx;
		height: 80rpx;
		background: #000000;
		line-height: 80rpx;
		margin: 148rpx auto 0;
	}
</style>